<template>
	<view class="container">
		<!-- 	1、体质指数（BMI）=体重（kg）÷身高^2（m）
				2、当BMI指数为18.5～24.9时属正常，
					BMI＜18.5为消瘦， 
					BMI≥25.0为超重，
					BMI在25.0～29.9之间为1级肥胖，
					BMI＞30.0～34.9为2级肥胖，
					BMI＞35.0～39.9为3级肥胖，
					BMI＞40.0为4级肥胖。
				3、 BMI是与体内脂肪总量密切相关的指标，该指标考虑了体重和身高两个因素。
					BMI简单、实用、可反映全身性超重和肥胖。
					在测量身体因超重而面临心脏病、高血压等风险时，比单纯的以体重来认定，
					更具准确性。-->
		<!-- BMI区域 -->
		<uni-section class="bmi" title="体质指数（BMI）简介" type="line">
			<uni-card :is-shadow="false" class="bmi-card">
				<text class="uni-cal">
					体质指数(BMI)=体重(kg)÷ 身高^2(m)
				</text>
				<uni-table class="bmi-res-table">
					<uni-tr>
						<uni-th align="center">BMI</uni-th>
						<uni-th align="left">结果</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr>
						<uni-td>18.5～24.9</uni-td>
						<uni-td>正常</uni-td>
					</uni-tr>
					<uni-tr>
						<uni-td>＜18.5</uni-td>
						<uni-td>消瘦</uni-td>
					</uni-tr>
					<uni-tr>
						<uni-td>≥25.0</uni-td>
						<uni-td>超重</uni-td>
					</uni-tr>
					<uni-tr>
						<uni-td>25.0～29.9</uni-td>
						<uni-td>1级肥胖</uni-td>
					</uni-tr>
					<uni-tr>
						<uni-td>30.0～34.9</uni-td>
						<uni-td>2级肥胖</uni-td>
					</uni-tr>
				</uni-table>

				<!-- 输入框和计算按钮 -->
				<view class="input-area">
					<view class="input-group">
						<text class="label">身高 (cm):</text>
						<input v-model="height" type="number" placeholder="请输入身高" />
					</view>
					<view class="input-group">
						<text class="label">体重 (kg):</text>
						<input v-model="weight" type="number" placeholder="请输入体重" />
					</view>

					<!-- 结果展示区 -->
					<view class="result-area">
						<text class="result-label">您的BMI:</text>
						<text class="result-value">{{ bmi }}</text>
						<text class="result-status">-{{ status }}</text>
					</view>
					<button @click="calculateBMI" type="primary">计算BMI</button>
				</view>
			</uni-card>
		</uni-section>

	</view>

</template>

<script>
	export default {
		data() {
			return {
				height: '',
				weight: '',
				bmi: '',
				status: ''
			};
		},
		methods: {
			calculateBMI() {
				if (this.height && this.weight) {
					const heightM = this.height / 100;
					const bmi = this.weight / (heightM * heightM);
					this.bmi = bmi.toFixed(2);
					this.setStatus(bmi);
				} else {
					this.bmi = '';
					this.status = '请输入完整的身高和体重';
				}
			},
			setStatus(bmi) {
				if (bmi < 18.5) {
					this.status = '消瘦';
				} else if (bmi >= 18.5 && bmi <= 24.9) {
					this.status = '正常';
				} else if (bmi >= 25.0 && bmi <= 29.9) {
					this.status = '1级肥胖';
				} else if (bmi >= 30.0 && bmi <= 34.9) {
					this.status = '2级肥胖';
				} else if (bmi >= 35.0 && bmi <= 39.9) {
					this.status = '3级肥胖';
				} else {
					this.status = '4级肥胖';
				}
			}
		}
	};
</script>

<style lang="scss">
	.container {
		padding: 20px;

		.bmi {
			.bmi-card {
				.input-area {
					margin-top: 20rpx;
				}

				.input-area {
					.input-group {
						display: flex;
						margin: 10rpx 0;
					}

				}


			}
		}
	}
</style>